<template>
    <view class="view-o">使用账号密码登录</view>

    <view class="view-2">账号</view>
    <view class="view-3 flex-c-s">
        <input placeholder="请输入账号" v-model="state.account" />
    </view>
    <view class="view-2">密码</view>
    <view class="view-3 flex-c-s">
        <u-input type="password" placeholder="请输入密码" border="none" v-model="state.password"></u-input>
    </view>
    <view class="submit-button flex-c-c" @tap="submit">登录</view>
</template>

<script setup>
import { reactive } from 'vue';
const emits = defineEmits(['submit', 'resetPassWord', 'changeLoginType']);
const state = reactive({
    password: '',
    account: '李金铭'
});
const { toast } = uni.$u;
const submit = () => {
    uni.setStorageSync('password', state.account);
    if (state.account && state.password=='ljm888') {
        emits('submit', { account: state.account, password: state.password });
    } else {
        toast('请校验账号密码');
    }
};
</script>
<style>
page {
    background: white;
}
</style>
<style lang="scss" scoped>
.view-o {
    width: 365rpx;
    height: 43rpx;
    font-size: 45rpx;
    font-family: DFHei-Md-80-Win-GB;
    color: #232323;
    margin-bottom: 30rpx;
    margin-left: 44rpx;
}

.view-t {
    margin: 0 44rpx 40rpx;
    color: #333;
}

.view-2 {
    margin: 0 44rpx 20rpx;
    font-weight: bold;
    font-size: 26rpx;
    color: #141414;
}

.view-3 {
    width: 666rpx;
    margin: 0 auto 30rpx;
    padding-bottom: 15rpx;
    border-bottom: 4rpx solid #eaeaea;
    margin-bottom: 30rpx;
}

.code-tips {
    width: 219rpx;
    height: 65rpx;
    background: $bg_color;
    border-radius: 8rpx;
    font-size: 24rpx;
    font-family: Microsoft YaHei;
    color: #ffffff;
}

.submit-button {
    margin: 36rpx auto 50rpx;
    width: 660rpx;
    height: 88rpx;
    background: $bg_color;
    border-radius: 8rpx;

    font-size: 24rpx;
    font-family: Microsoft YaHei;
    color: #ffffff;
}

.text-1 {
    font-size: 28rpx;
    font-family: Microsoft YaHei;
    color: #057efd;
}

.text-2 {
    font-size: 28rpx;
    font-family: Microsoft YaHei;
    color: #333;
}

.padding {
    padding: 0 44rpx;
}
</style>
